Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@uiw/react-portal

Package Overview
Dependencies
Maintainers
2
Versions
169
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@uiw/react-portal

Portal component

  • 4.22.3
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
614
increased by25.82%
Maintainers
2
Weekly downloads
 
Created
Source

Portal 入口

Buy me a coffee Open in unpkg NPM Downloads npm version

Portals 是 react 16 提供的官方解决方案,使得组件可以脱离父组件层级挂载在 DOM 树的任何位置,我们利用这个方法,可将模态对话框生成到根节点的外面。

import { Portal } from 'uiw';
// or
import Portal from '@uiw/react-portal';

基本使用

import { Portal } from 'uiw';

<Portal>
  此文本在 document.body 的末尾传送!
</Portal>
<Portal node={document && document.getElementById('dom-id')}>
  此文本在显示在 dom-id 的 dom 对象中 
</Portal>

切换不同的 <Portal />

{isVisiable && <Portal>切换不同的 Portal</Portal>}

Props

参数说明类型默认值
container指定容器节点生成,服务端渲染默认为 nullanydocument.body
visible当值为 true 的时候才会创建 createPortal,可避免初始化创建多余的 dom 节点挂载 @v4.9.0+ 之后移除了boolean-
onChildrenMount渲染后的回调函数 @v4.9.0+ 之后移除了() => void-

Keywords

FAQs

Package last updated on 29 Nov 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc